<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<c:choose>
    <c:when test="${sessionScope.isAdmin!=true}">
        <%
            response.setStatus(response.SC_MOVED_TEMPORARILY);
            response.setHeader("Location", "/");
        %>
    </c:when>
    <c:otherwise>
        <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <title>
                商品信息表列表
            </title>
            <style type="text/css">
                TABLE {
                    FONT-SIZE: 12px;
                    COLOR: #000000
                }

                .TitleLine {
                    padding-left: 12px;
                    FONT-WEIGHT: bold;
                    FONT-SIZE: 12px;
                    COLOR: #ffffff;
                    background-color: black;
                    height: 28px;
                    padding-top: 6px;
                }

                .vt9_title {
                    font-weight: bold;
                    font-size: 12px;
                    color: black;
                    background-color: #CCCCCC;
                    height: 20px;
                    line-height: 24px;
                }

                .T9_blackB {
                    FONT-WEIGHT: bold;
                    FONT-SIZE: 12px;
                    COLOR: black;
                    LINE-height: 25px;
                    TEXT-DECORATION: none;
                    TEXT-align: left;
                    background-color: #cecece;
                    padding-left: 5px;
                }

                .table_border td {
                    border-top: 1px #888 solid;
                    border-right: 1px #888 solid;
                    padding-left: 5px;
                }

                .table_border {
                    border-bottom: 1px #888 solid;
                    border-left: 1px #888 solid;
                }

                a {
                    color: #333;
                    TEXT-DECORATION: none;
                }
            </style>
            <script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
            <script type="text/javascript">
                $(function () {
                    $("#btn").click(function () {
                        let nameVal = $("#goods_name").val();
                        let typeVal = $("#type_id").val();
                        // alert(nameVal+""+typeVal);
                        $.get(
                            "/selectGoods",//请求的url
                            {
                                "goods_name": nameVal,
                                "type_id": typeVal
                            },
                            // $("#goods_name").serialize()+"&"+$("#type_id").serialize(),//发送给服务端的数据
                            function (data) {
                                let res = JSON.stringify(data);

                                $("#goodsList").html("");//清空商品列表
                                //
                                for (let i = 0; i < data.length; i++) {//循环添加商品
                                    let item = "";
                                    item += "<tr height=\"50\">";
                                    for (let key in data[i]) {

                                        if ("picture" == key) item += "<td  style=\"word-wrap:break-word;\"><img src=\"" + data[i][key] + "\"></td>";
                                        else item += "<td  style=\"word-wrap:break-word;word-break:break-all;\">" + data[i][key] + "</td>";

                                    }
                                    $("#goodsList").append(item);
                                }
                            },
                            "json"//响应数据的类型
                        );

                    })
                })

                function jumpAdd() {
                    window.location.href = 'goodsAdd.jsp';
                }

                function jumpUpdate() {
                    window.location.href = 'goodsUpdate.jsp';
                }

                function jumpDelete() {
                    window.location.href = 'goodsDelete.jsp';
                }
            </script>
        </head>

        <body>

        <table cellSpacing="1" cellPadding="0" width="100%" border="0" id="table7">
            <tr>
                <td class="TitleLine" colSpan="8" style="text-align: center">
                    商品信息表
                </td>
            </tr>
            <tr>
                <td colSpan="4" height="1">
                </td>
            </tr>
            <tr class="vt9_title">
                <td colSpan="4">
                    &nbsp; 商品信息表信息查询
                </td>
            </tr>
            <tr>
                <td colSpan="4" height="5">
                </td>
            </tr>
            <tr height="1">
                <td width="100"></td>
                <td width="230">
                <td width="100"></td>
                <td width="230"></td>
            </tr>
            <tr>
                <td>商品名称</td>
                <td><input style="WIDTH: 186px" name="goods_name" id="goods_name" value="*"/></td>

            </tr>
            <tr>
                <td>商品类型</td>
                <td><select style="WIDTH: 90px" name="type_id" id="type_id">
                    <option selected hidden disable value="0">请选择</option>
                    <option value="1">耳机</option>
                    <option value="2">手机</option>
                    <option value="3">电脑</option>
                    <option value="4">平板</option>
                </select>
                </td>
            </tr>
            <tr>
                <td height="6" colSpan="4">
                </td>
            </tr>
            <tr>
                <td></td>
                <td colspan="3">
                    <input type="button" value="查询" id="btn">
                    &nbsp;&nbsp; 提示：
                    <span id="Cabp_Control_errtip" style="COLOR: red">
      名称和类型都为空时输出全部商品，名称为空时输出你所选类型的全部商品
      </span>
                </td>
            </tr>
            <tr>
                <td height="10" colSpan="4">
                </td>
            </tr>

            <tr>
                <td colSpan="8">
                    <div style="width:100%; height:300px;overflow:auto">
                        <table border="0" cellspacing="0" cellpadding="0" width="800px" style="table-layout:fixed;">
                            <thead>
                            <tr height="25" class="T9_blackB">
                                <td width="200px">商品描述</td>
                                <td width="150px">商品名称</td>
                                <td width="50px">商品id</td>
                                <td width="250px">商品图片</td>
                                <td width="75px">商品价格</td>
                                <td width="75px">商品类型</td>
                            </tr>
                            </thead>
                            <tbody id="goodsList">

                            </tbody>
                        </table>

                    </div>
                </td>
            </tr>

            <tr>
                <td>
                    <input type="button" value=" 添 加 商 品 " onclick=jumpAdd()>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" value=" 修 改 商 品 " onclick=jumpUpdate()>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" value=" 删 除 商 品 " onclick=jumpDelete()>
                </td>
            </tr>
            </tr>

        </table>

        </body>

        </html>
    </c:otherwise>
</c:choose>


